import React,{Component} from 'react';
import Header from '../../system/header/Header';
import Footer from '../../component/footer/Footer';
import PropTypes from 'prop-types';
class GetFrame extends Component{
    state={
        frameHeight:''
    }
    getHeight = () => {
        let getHeight = function () {
            let hash = window.location.hash;
            if (hash && /height=/.test(hash)) {
                let h = hash.replace("#height=", "");
                this.setState({
                    frameHeight:h
                },()=>{
                    clearInterval(this.timer)
                });
            }
        }.bind(this);
        this.timer = setInterval(getHeight,200);
    };
    componentDidMount(){
        this.getHeight();
    };
    componentDidUpdate(){
        this.getHeight();
    };
    render(){
        let {frameHeight} = this.state;
        let {frameFile} = this.props;
        return(
            <div>
                <Header refName="goods" childNodes="goods-a" imgUrl={require('../../solution/img/solution.jpg')} mobileImg={require('../../component/mobileBanner/banner2.jpg')}/>
                <iframe title='iframe' frameBorder="no" src={`../website/${frameFile}`} style={{width:'100%',height:`${frameHeight}px`,marginBottom:'-5px'}} scrolling="no">
                </iframe>
                <Footer/>
            </div>
        )
    }
}
export default GetFrame;
GetFrame.propTypes = {
  frameFile:PropTypes.string.isRequired
};